var figure_box = document.querySelectorAll('.figure-box');
var video = document.querySelectorAll('.video1');
var img = document.querySelectorAll('.img1');
console.log(figure_box);
figure_box.forEach(function (value, index) {
    figure_box[index].addEventListener('mouseover', function () {
        // console.log(video[index]);
        // 鼠标经过，图片隐藏
        img[index].style.display = 'none';
        // 鼠标经过，视频显示
        video[index].style.display = 'block';
    })
    figure_box[index].addEventListener('mouseout', function () {
        // console.log(video[index]);
        // 鼠标离开，图片显示
        img[index].style.display = 'block';
        // 鼠标离开，视频隐藏
        video[index].style.display = 'none';
        // 鼠标移开，初始化视频
        video[index].currentTime = 0;
    })
    video[index].addEventListener('mouseover', function () {
        console.log(index);
        //给视频标签添加缓存播放---video标签属性。
        this.setAttribute("autoplay", "autoplay")
        //给视频标签添加循环播放---video标签属性。
        this.setAttribute("loop", "loop")
        //播放视频
        this.play();
    })
    video[index].addEventListener('mouseout', function () {
        //给视频标签添加缓存播放---video标签属性。
        this.pause();
    })
})